<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8" errorPage="500.jsp"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<%@ taglib uri="http://www.duyiedu.com" prefix="myFn"%>
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>场次</title>
    <link rel="stylesheet" href="css/reset.css">
    <link rel="stylesheet" href="css/showings.css">
    <link rel="stylesheet" href="css/common.css">
    <!-- 小图标 -->
  	<link rel="icon" href="css/favicon.ico" type="image/x-icon" />
    <script type="text/javascript" src="js/jquery-1.12.4.js"></script>
</head>
<body>
	<!-- 头部 -->
	<div class="header">
    	<div class="header-inner">
	      	<h1>
	        	<a href="index.html" class="logo">太平洋影城</a>
	      	</h1>
      		<div class="nav">
	        	<ul class="navbar">
		          	<li>
		            	<a href="index">首页</a>
		          	</li>
	          		<li>
	            		<a href="hotFilm.do" class="active">电影</a>
	          		</li>
	          		<li>
	            		<a href="#">影院</a>
	          		</li>
	          		<li>
	            		<a href="#">演出</a>
	          		</li>
		          	<li>
		            	<a href="billboard.do">榜单</a>
		          	</li>
	          		<li>
	            		<a href="#">热点</a>
	          		</li>
	          		<li>
	            		<a href="#">商城</a>
	          		</li>
	        	</ul>
      		</div>
      		<div class="user-info">
        		<div class="user-avatar J-login">
	          		<c:choose>
	       				<c:when test="${sessionScope.userLogin !=null}">
	         				<img src="${sessionScope.userLogin.uImg}">
	       				</c:when>
	       				<c:otherwise>
	         				<img src="img/top_img/default_head.png">
	       				</c:otherwise>
	     			</c:choose>
	     			<span class="caret"></span>
	     			<c:choose>
	       				<c:when test="${sessionScope.userLogin !=null}">
	         				<ul class="user-menu yes-login-menu">
					           	<li class="text">
					             	<a href="order.do?uid=${sessionScope.userLogin.uId}">我的订单</a>
					           	</li>
					           	<li class="text login-name" >
					             	<a href="userEssential.do?uId=${sessionScope.userLogin.uId}">基本信息</a>
					           	</li>
					           	<li class="text">
					             	<a href="exit.do" class="J-logout">退出登录</a>
					           	</li>
	         				</ul>
	       				</c:when>
				       	<c:otherwise>
				         	<ul class="user-menu no-login-menu">
					           	<li>
					           		<a href="login.jsp">登录</a>
					           	</li>
				         	</ul>
				       	</c:otherwise>
	     			</c:choose>
      			</div>
    		</div>
		    <form action="searchFilm.do" method="post" class="search-form">
		      	<input name="kw" class="search" type="search" maxlength="32" placeholder="找影视剧、影人、影院">
		      	<input class="submit" type="submit" value="">
		    </form>
    		<div class="app-download">
		      	<a href="#">
		        	<span class="iphone-icon"></span>
		        	<span class="apptext">APP下载</span>
		        	<span class="caret"></span>
		        	<div class="download-icon">
		          		<p class="down-title">扫码下载APP</p>
		          		<p class="down-content">选座更优惠</p>
		        	</div>
		      	</a>
    		</div>
  		</div>
	</div>
	<!-- 占位符 -->
    <div class="header-placeholder"></div>
   	<!-- 海报 -->
    <div class="banner">
        <div class="wrapper clearfix">
          <div class="celeInfo-left">
            <div class="avatar-shadow">
              <img class="avatar" src="${sessionScope.filmOne.filmImg}" alt="${sessionScope.filmOne.filmName}海报封面">
            </div>
          </div>
          <div class="celeInfo-right clearfix">
                <div class="movie-brief-container">
		          <h1 class="name">${sessionScope.filmOne.filmName}</h1>
		          <div class="ename ellipsis">${sessionScope.filmOne.filmForeignName}</div>
		          <ul>
		            <li class="ellipsis">
		            	<c:forEach items="${sessionScope.filmOne.filmTypes}" var="type"> 
		            		<a class="text-link" href="#" target="_blank"> ${type.typeName }</a>
		            	</c:forEach>
		            </li>
		            <li class="ellipsis">${sessionScope.filmOne.filmPlace}/ ${sessionScope.filmOne.filmTime}</li>
		            <li class="ellipsis">${sessionScope.filmOne.filmShowTime}</li>
		          </ul>
        </div>
        <div class="action-buyBtn">
          <div class="action clearfix">
            <a class="wish ">
              <div>
                <i class="icon wish-icon"></i>
                  <span class="wish-msg" data-act="wish-click">想看</span>
              </div>
            </a>
            <a class="score-btn " data-bid="b_rxxpcgwd">
              <div>
                <i class="icon score-btn-icon"></i>
                <span class="score-btn-msg" data-act="comment-open-click">
                    评分
                </span>
              </div>
            </a>
          </div>
            <a class="btn buy" href="showings?filmId=${sessionScope.filmOne.filmId}" target="_blank">特惠购票</a>
        </div>
        <div class="movie-stats-container">
            <div class="movie-index">
              <p class="movie-index-title">猫眼口碑</p>
              <div class="movie-index-content score normal-score">
                  <span class="index-left info-num ">
                  <c:choose>
                   		<c:when test="${sessionScope.reviewAndFilm.reviewCount == null}">
                   			<span class="stonefont" style="font-size: 22px;">暂无</span>
                   		</c:when>
                   		<c:otherwise>
                   			<span class="stonefont">${sessionScope.filmOne.reviewScore}</span>
                   		</c:otherwise>
                   	</c:choose>
                  </span>
                  <div class="index-right">
                    <div class="star-wrapper">
                      <div class="star-on" style="width:${(sessionScope.filmOne.reviewScore)*10}%;"></div>
                    </div>
                    <span class="score-num"><span class="stonefont">${sessionScope.reviewAndFilm.reviewCount != null ? sessionScope.reviewAndFilm.reviewCount : 0}</span>人评分</span>
                  </div>
              </div>
            </div>
            <div class="movie-index">
              <p class="movie-index-title">累计票房</p>
              <div class="movie-index-content box">
                  <span class="stonefont">${sessionScope.filmOne.boxoffice != null ? sessionScope.filmOne.boxoffice : 0}</span><span class="unit">亿</span>
              </div>
            </div>
        </div>
          </div>
        </div>
    </div>
    <!-- 内容部分 -->
    <div class="container">
        <div class="show-list  active">
            <div class="movie-info">
      <div>
        <h2 class="movie-name">${sessionScope.filmDetails.filmName}</h2>
    
            <span class="score sc">9.1</span>
    
      </div>
    
      <div class="movie-desc">
        <div>
          <span class="key">时长 :</span>
          <span class="value">${sessionScope.filmDetails.filmTime}</span>
        </div>
        <div>
          <span class="key">类型 :</span>
          <c:forEach items="${sessionScope.filmDetails.filmTypes}" var="type">
          	<span class="value">
            	<a class="text-link" href="#">${type.typeName}</a>
        	</span>
          </c:forEach>
        </div>
        <div>
          <span class="key">主演 :</span>
          <c:forEach items="${sessionScope.filmDetails.performers}" var="performer">
          	<span>${performer.perName}</span>
          </c:forEach>
        </div>
      </div>
    </div>
    
    <div class="show-date">
      <span>观影时间 :</span>
      <c:forEach items="${sessionScope.showingsDateList}" var="date" varStatus="step">
      	<span flag="${step.index}" class="${param.flag == step.index?'date-item active':'date-item'}">${myFn:formatDate(date)}</span>
      </c:forEach>
      <input type="hidden" id="filmIdHidden" value="${sessionScope.filmDetails.filmId}">
    </div>
       	<div class="plist-container active">
            <table class="plist">
                <thead>
                    <tr>
	                    <th>放映时间</th>
	                    <th>语言版本</th>
	                    <th>放映厅</th>
	                    <th>售价（元）</th>
	                    <th>选座购票</th>
                    </tr>
                </thead>
                <tbody>
                    <c:forEach items="${sessionScope.showingsList}" var="showings">
                    	<tr class="">
		                    <td>
		                        <span class="begin-time">${myFn:formatTime(showings.showingsStartTime)}</span>
		                        <br>
		                        <span class="end-time">${myFn:formatTime(showings.showingsEndTime)}散场</span>
		                    </td>
		                    <td>
		                        <span class="lang">${showings.film.filmIunguage}</span>
		                    </td>
		                    <td>
		                        <span class="hall">${showings.filmOffice.offName}</span>
		                    </td>
		                    <td>
		                        <span class="sell-price"><span class="stonefont">${showings.showingsPrice}</span></span>
		                    </td>
		                    <td>
		                        <a href="selectSeats.do?showingsId=${showings.showingsId}" class="buy-btn normal">选座购票</a>
		                    </td>
	                    </tr>
                    </c:forEach>
                </tbody>
            </table>
        </div> 
        </div>
    </div>
    <div id="comment-form-container" class="jBox-wrapper jBox-Modal jBox-Default">
            <div class="jBox-container">
                <div class="jBox-content" style="width: 550px; height: 450px;">
                    <form id="comment-form" action="review.do" method="post"> 
                    	<input type="hidden" name="filmId" value="${sessionScope.filmOne.filmId}">
                    	<input type="hidden" name="uId" value="${sessionScope.userLogin.uId}">
                        <div class="score-msg-container active">
                            <div class="score">
                            	<span class="num">${sessionScope.reviewInfo.revScore == null ? '' : sessionScope.reviewInfo.revScore}</span>
                            	分
                            </div>
                            <div class="score-message">一般般</div>
                            <div class="no-score">请点击星星评分</div>
                        </div>
                        <div class="score-star-contaienr">
                            <ul class="score-star clearfix">
                                <li><i class="half-star left"></i><i class="half-star right"></i></li>
                                <li><i class="half-star left"></i><i class="half-star right"></i></li>
                                <li><i class="half-star left"></i><i class="half-star right"></i></li>
                                <li><i class="half-star left"></i><i class="half-star right"></i></li>
                                <li><i class="half-star left"></i><i class="half-star right"></i></li>
                            </ul>
                        </div>
                        <div class="content-container">
                            <textarea flag="${sessionScope.reviewInfo != null ? sessionScope.reviewInfo.revContent:''}" placeholder="快来说说你的看法吧"  name="content" id="textarea" cols="30" rows="10">
                            </textarea>
                           		
                            <span class="word-count-info">还需输入6个字</span>
                        </div>
                        <input type="hidden" name="score" value="5">
                        <input class="btn disabled" type="submit" value="提交" id="subReview">
                    </form>
                    <div class="close">×</div>
                </div>
            </div>
        </div>
    </div>
<!-- 底部 -->
	<div class="footer">
    	<div class="content">
      		<div class="moduleBox">
        		<div class="informationBox">
          			<div class="copy_van">
            			<a class="ycgg" href="">
            				<span>影城公告</span>
            			</a>
            			<ul>
              				<li>影城公告</li>
            			</ul>
          			</div>
          			<div class="copy_van">
            			<a class="ycgg" href="">
            				<span>会员中心</span>
            			</a>
			            <ul>
			              	<li>加入会员</li>
			              	<li>会员活动</li>
			              	<li>会员优惠</li>
			            </ul>
          			</div>
          			<div class="copy_van">
            			<a class="ycgg" href="">
            				<span>影片资讯</span>
            			</a>
			            <ul>
			              	<li>正在热映</li>
			              	<li>即将上映</li>
			            </ul>
          			</div>
		          	<div class="copy_van">
		            	<a class="ycgg" href="">
		            		<span>影城活动</span>
		            	</a>
		            	<ul>
		              		<li>影城活动</li>
		              		<li>电影资讯</li>
		            	</ul>
		          	</div>
		          	<div class="copy_van">
		            	<a class="ycgg" href="">
		            		<span>关于我们</span>
		            	</a>
			            <ul>
			              	<li>影城介绍</li>
			              	<li>影院介绍</li>
			              	<li>联系我们</li>
			            </ul>
		          	</div>
        		</div>
        		<div class="abc">
          			<div class="textFloat">
            			<div class="erwei1">
                        	<span class="spans ">
                               	<img class="img1" src="img/foot_img/wxerweima.png" alt="">
                            </span>
              				<span class="spans spanss">
                            	<a href="">微信在线购票</a>
                            </span>
            			</div>
            			<div class="erwei2">
                            <span class="spans">
                        		<img class="img1" src="img/foot_img/xcx.jpg" alt="">
                            </span>
              				<span class="spans spanss">
                                <a href="">小程序在线购票</a>
                            </span>
            			</div>
          			</div>
        		</div>
        		<div class="right_information">
		          	<ul class="ul1">
		            	<li class="lis1">连锁热线：</li>
		            	<li class="lis2">400-850-3366</li>
		          	</ul>
		          	<ul class="ul1">
		            	<li class="lis3">官方微信：</li>
		            	<li class="lis4">搜索“猫眼电影”</li>
		          	</ul>
        		</div>
		        <div class="top_btn">
                    <span>
                       	<a href="javascript:void(0)" id="top">TOP</a>
                    </span>
		        </div>
      		</div>
	      	<div class="foot_text">
	       		<div class="foot"> 版权所有(C)猫眼电影投资有限公司　　技术支持：3-1-501</div>
      		</div>
    	</div>
  	</div>
</body>
<script type="text/javascript" src="js/filmDetails.js"></script>
<script type="text/javascript" src="js/common.js"></script>
<script type="text/javascript" src="js/showings.js"></script>
</html>